<template>
    <l-layout class="l-tab-page" :top="formHeight + 12">
        <template #top>
            <l-query :span="5" :labelWidth="150" :height.sync="formHeight" :items="awaitCashFormColmuns"
                :formData="awaitCashFormData" :loading="tableLoading" @search="handleSearch">
                <template #updateCycleCode>
                    <l-select :options="update_cycle_code_options" v-model="awaitCashFormData['updateCycleCode']"
                        @change="handleSearch" />
                </template>
                <template #regionCode>
                    <l-select :options="region_code_options" v-model="awaitCashFormData['regionCode']"
                        @change="handleSearch" />
                </template>
                <template #name>
                    <el-input v-model="awaitCashFormData['name']" :placeholder="$t('请输入')" clearable
                        @change="handleSearch" />
                </template>
                <template #muTaxQRange>
                    <l-number-range v-model="awaitCashFormData['muTaxQRange']" @change="handleSearch"></l-number-range>
                </template>
                <template #comprehensiveEvaluationCode>
                    <l-select :options="comprehensive_evaluation_options"
                        v-model="awaitCashFormData['comprehensiveEvaluationCode']" @change="handleSearch" />
                </template>
            </l-query>
        </template>
        <l-panel style="padding-top:0;">
            <template #toolLeft>
                <div class="l-panel--item">
                    <l-excel-btns></l-excel-btns>
                </div>
            </template>
            <template #toolRight>
                <l-tool-btns :hasAdd="false" :hasTableSetting="true" @setting="lr_handleSettingTable">
                </l-tool-btns>
            </template>
            <l-table ref="mainTable" :loading="tableLoading" :columns="awaitCashTableColmuns" :dataSource="tableData"
                :isPage="true" :pageTotal="tableTotal" :tablePage.sync="tableCurrentPage" @loadPageData="turnTablePage">
                <!-- l-table 作用域插槽的索引叫做 rowIndex -->
                <template #name="scope">
                    <a @click="handleDetails(0, scope.row)">{{ scope.row.name || '---' }}</a>
                </template>
                <template #evaluationDate="{ row, rowIndex }">
                    <!-- evaluationDate是必选项，所以一定存在，不会因为undefined报错 -->
                    <!-- v-if="row.assess.length"
v-if="row.assess.length"
v-if="row.assess.length"
v-if="row.assess.length" -->
                    <span>{{ row.evaluationDate.replace("T00:00:00", "") || '---'
                    }}</span>
                    <!-- <span v-else>---</span> -->
                </template>
                <template #isRequirement="{ row, rowIndex }">
                    <span>{{ row.isRequirement }}</span>
                    <!-- <span v-else>---</span> -->
                </template>
                <template #comprehensiveEvaluationCode="{ row, rowIndex }">
                    <span>{{ row.comprehensiveEvaluationCode.toUpperCase() }}</span>
                    <!-- <span v-else>---</span> -->
                </template>
                <template #explain="{ row, rowIndex }">
                    <span>{{ row.explain || '---' }}</span>
                    <!-- <span v-else>---</span> -->
                </template>
                <l-table-btns :btns="tableBtns" :filterBtns="filterBtns" @click="lr_handleTableBtnClick"
                    :btnNum="6"></l-table-btns>
            </l-table>

        </l-panel>
        <AwaitCashDialog ref="awaitCashDialog" @refresh="handleRefresh" />
        <DetailDialogForm ref="DetailDialogForm" />
    </l-layout>
</template>


<script>
import AwaitCashDialog from "./AwaitCashDialog"
import DetailDialogForm from "../../../enterpriseManagement/views/enterpriseList/DetailDialogForm/index"
import {
    awaitCashFormColmuns,
    awaitCashFormData,
    awaitCashTableColmuns,
    awaitCashapi
} from "./columns";
export default {
    data() {
        return {
            formHeight: 44,
            awaitCashFormData,
            awaitCashFormColmuns,
            awaitCashTableColmuns,
            tableLoading: true,
            tableData: [],
            tableTotal: 0,
            tableCurrentPage: 1,
            tablePageSize: 50,
            tableBtns: [{ prop: "Cash", label: "兑现" }],
        };
    },
    components: {
        AwaitCashDialog,
        DetailDialogForm
    },
    computed: {
        update_cycle_code_options() {
            return this.lr_dataItemOptions(this.lr_dataItem["update_cycle_code"]);
        },
        region_code_options() {
            return this.lr_dataItemOptions(this.lr_dataItem["region_code"]);
        },
        comprehensive_evaluation_options() {
            return this.lr_dataItemOptions(this.lr_dataItem["comprehensive_evaluation"]);
        }
    },
    mounted() {
        this.$watch(
            () => this.awaitCashFormData.muTaxQRange,
            (newVal) => {
                if (newVal === "") {
                    this.awaitCashFormData.muTaxQRange = null;
                }
            }
        )
        this.init();
    },
    methods: {
        async handleRefresh() {
            await this.loadTableData()
            this.$emit("refresh")
        },
        handleDetails(index, row) {
            this.$refs.DetailDialogForm.open(row);
        },
        // 兑现按钮
        handleCash(index, row) {
            const currentDate = new Date();
            const year = currentDate.getFullYear();
            const month = String(currentDate.getMonth() + 1).padStart(2, '0');
            const day = String(currentDate.getDate()).padStart(2, '0');
            const formattedDate = `${year}-${month}-${day}`;
            this.$set(this.$refs.awaitCashDialog.awaitCashDialogFormData, 'redemptionDate', formattedDate);
            this.$refs.awaitCashDialog.open(row)
        },
        init() {
            this.loadTableData();
        },
        filterBtns(row, btns) {
            return btns;
        },
        handleSearch() {
            this.loadTableData();
        },
        turnTablePage({ rows }) {
            this.tablePageSize = rows;
            this.loadTableData(true);
        },
        async loadTableData(isNotFirst) {
            if (!isNotFirst) {
                this.tableCurrentPage = 1;
            }
            this.tableLoading = true;
            let awaitCashFormData = this.$deepClone(this.awaitCashFormData);
            awaitCashFormData.rows = this.tablePageSize;
            awaitCashFormData.page = this.tableCurrentPage;
            awaitCashFormData.sidx = "modifyTime";
            awaitCashFormData.sord = "DESC";
            let data = await this.$awaitWraper(
                awaitCashapi.getPage(awaitCashFormData)
            );
            this.tableData = data.rows.map(i => {
                i.evaluationDate = i.assess[i.assess.length - 1]?.evaluationDate || ""
                i.comprehensiveEvaluationCode = i.assess[i.assess.length - 1]?.comprehensiveEvaluationCode || ""
                i.isRequirement = i.assess[i.assess.length - 1]?.isRequirement ? "是" : "否"
                i.explain = i.assess[i.assess.length - 1]?.explain || ""
                i.assess = null
                i.redemption = null
                return i;
            })
            this.tableTotal = data.length;
            this.tableLoading = false;
        },
    }
}
</script>


<style scoped lang='scss'></style>